Ext.define('Intranet.Desktop.view.Store', {
    extend: 'Ext.panel.Panel',
    
    alias: 'widget.modulesStore',
    
    id: 'store',
    
    layout: 'fit',
    
    width: 700,
    height: 400,
    
    listeners: {
        
        afterrender: function(e, eOpts){
            
            var modulesStore = Ext.create('Intranet.Desktop.store.AllModulesStore');
            
            var rightMenu = new Ext.menu.Menu({
                items: [{
                      text: 'Register',
                      id: 'register-ctxmenu'
                  }, '-', {
                      text: 'Discription',
                      id: 'description-ctxmenu'
                  }],
              
                  listeners: {
                        click: function(menu, item, e, eOpts){

                            switch (item.id) {
                                case 'register-ctxmenu':
                                    Ext.Msg.alert('Register', 'Register menu clicked');
                                    
                                    break;
                                    
                                case 'description-ctxmenu':
                                    Ext.Msg.alert('View Description', 'View Description menu clicked');
                                    
                                    break;
                            }
                        }
                    }
           });

            
            var dataview = Ext.create('Ext.view.View', {
                    store: modulesStore,
                    tpl: '<tpl for=".">' +
                            '<div class="module-wrapper">' +
                                    '<span class="name">{name}</span>' +
                            '</div>' +
                    '</tpl>',
                    itemSelector: 'div.module-wrapper',
                    selectedItemCls: 'module-selected', 
                    emptyText: 'No module has been installed on system!',
                    deferEmptyText: false,
                    id: 'storeView',
                    
                    listeners: {
                        itemcontextmenu: function (view, record, el, index, e, eOpts) {
                            e.preventDefault();
                            rightMenu.showAt(e.getXY());
                        }
                    }
                    
                    
            });
            Ext.getCmp('storeModulePanel').add(dataview);
        },
        scope: this
        
    },
    

    items: [{
            xtype: 'panel',
            header: false,
            bodyPadding: 10,
            id: 'storeModulePanel',
            items: [],
            
            bbar: ['->', {
                    xtype: 'textfield',
                    name: 'search',
                    style: {
                        marginLeft: 5
                    }
            }, {
                    xtype: 'button',
                    text: 'Search',
                    border: 5,
                    style: {
                        borderColor: '#669999',
                        borderStyle: 'solid',
                        marginLeft: 5,
                        marginRight: 25
                    }
            }, '-' , {
                    xtype: 'button',
                    text: 'Register',
                    id: 'registerBtn',
                    border: 5,
                    style: {
                        borderColor: '#669999',
                        borderStyle: 'solid',
                        marginLeft: 5,
                        marginRight: 15
                    }
                    
            }]
    }]
        
});


